<template>
  <div class="app-container calendar-list-container">
    <search :list="queryList" :queryEntity="queryEntity" :span="8"></search>
    <buttons :showQuery="true" :showBack="false" @query="doQuery" :list="btnList" :disabled="disabled" placeholder="订单号" :permissions="permissions">
      <span class="btn-slot-box">
        <el-input placeholder="序列号" v-model="searchText" ref="searchText" class="input-box" size="small">
          <el-button slot="append" icon="el-icon-search" @click="doQuickSearch()">搜索序列号</el-button>
        </el-input>
        <el-input placeholder="数量" v-model="numberSize" ref="searchText" class="number-box" type="number" size="small">
          <el-button slot="append" @click="printNumber()">打印序列号</el-button>
        </el-input>
      </span>
    </buttons>
    <grid gridTitle="验布信息" :url="url" :columns="columns" :enableEdit="false" :loading="true" ref="mainGrid" height="auto" diffHeight="155" :pagination="false"
      :permissions="permissions" :multi="false" @change="rowCilck" :queryEntity="queryEntity" @yb="doYb">
    </grid>
  </div>
</template>
<script>
import request from '@/router/axios'
import { Message, MessageBox } from 'element-ui'
import url from '@/const/apiURL'
import grid from '@/components/Grid'
import buttons from '@/components/Buttons'
import { mapGetters } from 'vuex'
import { BusinessOrderStatusFormatter, BusinessTypeFormatter, YesOrNoFormatter } from '@/const/dict'
import search from '@/components/Search'
import { colunms } from '@/const/colunms'
import { dict } from '@/const/dict'
import { queryField } from '@/const/query'
import { formData } from '@/const/formData'
import { getLodop } from '@/const/lodop'

export default {
  components: { grid, buttons, search },
  data () {
    return {
      searchText: null,
      numberSize: 5,
      orderNo: '',
      url: url.BUSINESS_QUICK_LIST_URL,
      entity: {},
      queryEntity: { key: 'key' },
      disabled: true,
      columns: [
        {
          label: '操作', width: 100, prop: 'op', align: 'center', template: 'btn', opList: [
            { name: '验布', clickName: 'yb', auth: 'business_quick' }
          ]
        },
        { label: '大货订单', width: 180, prop: 'orderNo', align: 'center' },
        { label: '工序', width: 100, prop: 'stepName', align: 'center' },
        { label: '客户名称', width: 200, prop: 'customerName', align: 'center' },
        { label: '物料名称', minWidth: 100, prop: 'goodsName', align: 'center' },
        { label: this.global.modelName, width: 80, prop: 'modelName', align: 'center' },
        { label: this.global.modelProp, width: 100, prop: 'modelProp', align: 'center' }
      ],
      btnList: [

      ],
      queryList: [
        { name: '大货订单', type: 'query', prop: 'orderNo', rowValue: 'orderNo', rowName: 'orderNo', url: url.ORDER_LIST_URL, columns: colunms().orderColumns, pagination: true, queryList: queryField().order, queryEntity: { status: 1 }, autoInput: true },
        { name: '工序', type: 'query', prop: 'stepCode', rowValue: 'stepCode', rowName: 'stepName', url: url.STEP_LIST_URL, columns: colunms().stepColumns, pagination: true, queryList: queryField().step, queryEntity: { status: 1 } },
        { name: '客户名称', type: 'query', prop: 'customerCode', rowValue: 'customerCode', rowName: 'customerName', url: url.CUSTOMER_LIST_URL, columns: colunms().customerColumns, pagination: true, queryList: queryField().customer, queryEntity: { customerType: 'HANDLE' } },
      ]
    }
  },
  mounted () {
    this.$refs.searchText.focus();
  },
  created () {
    this.code = this.$route.query.code
    this.initLodop()
  },
  computed: {
    ...mapGetters(['permissions'])
  },
  methods: {
    initLodop () {
      LODOP = getLodop()
      LODOP.PRINT_INIT('') //打印初始化
      LODOP.SET_PRINT_MODE("PROGRAM_CONTENT_BYVAR", true);
      LODOP.SET_PRINT_STYLE('FontSize', 18) //设置对象风格
      LODOP.SET_PRINT_STYLE('Bold', 1) ////设置对象风格
      LODOP.SET_PRINT_PAGESIZE(0, 2000, 2000, '') //设定纸张大小
      LODOP.SET_PRINT_MODE('PRINT_PAGE_PERCENT', '55%')//设置缩放
      LODOP.SET_PREVIEW_WINDOW(2, 2, 0, 0, 0, '')//设置窗口
    },
    doQuery (text) {
      this.$refs['mainGrid'].doQuery(text)
    },
    rowCilck (row) {
      this.disabled = row.length == 0
    },
    doYb (row) {
      this.$router.push({ path: '/prod/quick/view', query: { orderNo: row.orderNo, stepCode: row.stepCode, customerCode: row.customerCode, goodsCode: row.goodsCode } })
    },
    doQuickSearch () {
        console.log(this.searchText,this.searchText=="")
      this.search(this.searchText==""?null:this.searchText)
      this.searchText = null
    },
    printNumber () {
      let _this = this
      this.sizeUrl(this.numberSize).then(data => {
        if (data) {
          data.forEach(row => {
            eval(_this.global.numberPrint)
            LODOP.SET_PRINT_STYLEA("序列号", "CONTENT", row);
            //打印
            LODOP.PRINT()
          });
        }
      })
    },
    search (serialNumber) {
      this.searchUrl({ serialNumber }).then(data => {
        if (data) {
          this.$router.push({ path: '/prod/quick/view', query: data })
        }
      })
    },
    searchUrl (data) {
      return request({
        url: url.BUSINESS_QUICK_SEARCH_URL,
        method: 'post',
        data: data
      })
    },
    sizeUrl (quantity) {
      return request({
        url: url.BUSINESS_KEYS_URL,
        method: 'post',
        data: { key: 'key' },
        params: { quantity }
      })
    }
  }
}
</script>

<style rel="stylesheet/scss" lang="scss" scoped>
.w-body {
  padding-top: 8px;
}
.w-table {
  border: 1px solid #ebeef5;
}
.w-table-title {
  border: 1px solid #ebeef5;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: normal;
  word-break: break-all;
  line-height: 23px;
  display: inline-block;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  position: relative;
  vertical-align: middle;
  width: 100%;
  font-size: 14px;
  color: gray;
}
.input-box {
  clear: both;
  width: 450px;
}
.number-box {
  clear: both;
  width: 220px;
}
.btn-slot-box {
  padding-top: -15px;
}
</style>
